<style lang="less">
@import '../../../styles/common.less';
</style>
<template>
  <Row>
    <Form :label-width="150" inline>
      <div class='main_item'>
        <div @click="dataShow('actionCodeData')" id="moxx" class="main_item_title">
          <span style="font-weight:bold;" icon="md-arrow-dropdown">行动代码</span>
          <span style="float:right">
            <Icon type="md-arrow-dropdown" id="actionCodeData_icon"></Icon>
          </span>
        </div>
        <div id="actionCodeData" class="main_item_content_block">
          <div style="margin:30px 10px 10px 10px;">
            <FormItem label="行动代码:">
              <Select v-model="actionInfo.actionCodeName" class="v-select-wrapper" style="width:150px" :label-in-value=true @on-change="actionCodeChange">
                <Option v-for="item in actionCodeList" :value="item.actionCodeName" :key="item.actionCodeName">{{ item.actionCodeComment }}</Option>
              </Select>
            </FormItem>
            <FormItem label="行动结果">
              <Select v-model="actionInfo.actionResult" class="v-select-wrapper" style="width:150px" :label-in-value=true @on-change="actionResultChange">
                <Option v-for="item in actionResultList" :value="item.actionStatusCode" :key="item.actionStatusCode">{{ item.actionStatusDescp }}</Option>
              </Select>
            </FormItem>
            <FormItem label="备注">
              <Input v-model="actionInfo.remarks" style="width:150px" />
            </FormItem>
            <FormItem label="承诺金额">
              <Input v-model="actionInfo.promiseAmount" style="width:150px" />
            </FormItem>
            </br>
            <FormItem label="承诺日期:">
              <DatePicker v-model="actionInfo.promiseDate" type="date" placement="bottom-end" style="width: 150px"></DatePicker>
            </FormItem>
            <FormItem label="联系人">
              <Select v-model="actionInfo.relationCode" class="v-select-wrapper" style="width:150px" :label-in-value=true @on-change="relationManChange">
                <Option v-for="item in relationManList" :value="item.name" :key="item.name">{{ item.remark }}</Option>
              </Select>
            </FormItem>
            <FormItem label="联系方式">
              <Select v-model="actionInfo.relationType" class="v-select-wrapper" style="width:150px" :label-in-value=true @on-change="relationTypeChange">
                <Option v-for="item in relationTypeList" :value="item.value" :key="item.value">{{ item.label }}</Option>
              </Select>
            </FormItem>
            <FormItem label="约会时间">
              <DatePicker v-model="actionInfo.meetDate" type="date" placement="bottom-end" style="width: 150px"></DatePicker>
            </FormItem>
            <FormItem>
              <Button type="primary" @click="save" v-if="this.$route.query.overdueType !='1'">保存</Button>
            </FormItem>
          </div>
        </div>
      </div>
    </Form>
    <Form action="" method="get" name="exportFile" id="exportFile" enctype="multipart/form-data">
      <input id="id" name="id" type="hidden" />
    </Form>
  </Row>
</template>

<script>
export default {
  name: 'collect-base-info',
  data () {
    return {
      index: '',
      actionInfo: {
        actionCode: '',
        actionName: '',
        actionStatusCode: '',
        actionStatusName: '',
        remarks: '',
        promiseAmount: '',
        promiseDate: '',
        contactPerson: '',
        relationCode: '',
        relationType: '',
        contactType: '',
        meetDate: '',
        loanId: '',
        custCardNo: '',
        overdueCode: ''
      },
      actionCodeList: [],
      actionResultList: [],
      electricalResultList: [

      ],
      relationManList: [],
      relationTypeList: [
        {
          value: '0001',
          label: '手机'
        },
        {
          value: '0002',
          label: '单位电话'
        },
        {
          value: '0003',
          label: '家庭电话'
        },
        {
          value: '0004',
          label: '其他联系电话'
        },
        {
          value: '0005',
          label: '传真'
        }
      ],

      comptParams: {
        loanId: '',
        overdueCode: '',
        pageNum: 1,
        pageSize: 10,
        total: 0
      }
    }
  },
  computed: {
    avatorImage () {
      return localStorage.avatorImgPath
    }
  },

  created () {
    // 初始化当前页面请求对象实例
    this.$ajax = this.$util.ajax()
    this.initData()
  },
  methods: {
    pageChange: function (pageNum) {
      var vm = this
      vm.comptParams.pageNum = pageNum
      vm.initData()
    },
    sizeChange: function (pageLength) {
      var vm = this
      vm.comptParams.pageSize = pageLength
      vm.initData()
    },
    initData () {
      var vm = this
      vm.comptParams.loanId = this.collectTaskParams.loanId
      vm.comptParams.overdueCode = this.collectTaskParams.overdueCode
      vm.comptParams.overdueCaseId = this.collectTaskParams.overdueCaseId
      this.$ajax.post(this.$appContext.marvels_core_debtor + 'debtor/general/collectionManagement/service/initialOperationalData', vm.comptParams).then(re => {
        var data = re.data.data
        vm.actionCodeList = data.actionCodeList || []
        vm.actionResultList = data.actionReultList || []
        vm.relationManList = data.relationList || []
      }).catch(er => {

      })
    },
    relationManChange (value) {
      this.actionInfo.contactPerson = value.label
    },
    relationTypeChange (value) {
      this.actionInfo.contactType = value.label
    },
    actionCodeChange (value) {
      this.actionInfo.actionName = value.label
    },
    actionResultChange (value) {
      this.actionInfo.actionStatusName = value.label
    },

    dataShow: function (tagId) {
      var clickTag = document.getElementById(tagId)
      if (clickTag.className === 'main_item_content') {
        clickTag.className = 'main_item_content_block'
        document.getElementById(tagId + '_icon').className = 'ivu-icon ivu-icon-md-arrow-dropup'
      } else {
        clickTag.className = 'main_item_content'
        document.getElementById(tagId + '_icon').className = 'ivu-icon ivu-icon-md-arrow-dropdown'
      }
    },
    reset () {
      var vm = this
      vm.actionInfo.actionCodeName = ''
      vm.actionInfo.actionResult = ''
      vm.actionInfo.remarks = ''
      vm.actionInfo.promiseAmount = ''
      vm.actionInfo.promiseDate = ''
      vm.actionInfo.relationCode = ''
      vm.actionInfo.relationType = ''
      vm.actionInfo.meetDate = ''
    },
    save () {
      var vm = this
      vm.actionInfo.loanId = this.collectTaskParams.loanId
      vm.actionInfo.overdueCode = this.collectTaskParams.overdueCode
      vm.actionInfo.overdueCaseId = this.collectTaskParams.overdueCaseId
      vm.actionInfo.isFinished = 'Y'
      this.$ajax.post(this.$appContext.marvels_core_debtor + 'debtor/general/collectionManagement/service/addActionInfo', vm.actionInfo).then(re => {
        var data = re.data
        var code = data.code
        var message = data.message
        if (code !== 'success') {
          this.$Message.warning(message)
        } else {
          this.$Message.warning('添加成功！')
        }
        this.reset()
        vm.initData()
      }).catch(er => {

      })
    }

  },
  props: {
    collectTaskParams: Object
  }

}
</script>
